CSS property - padding

Beschrijving

De padding eigenschap voegt witruimte toe in het element, tussen de randen en de inhoud. Je kan de padding individueel instellen voor de boven-, onder-, linker- en rechterkant van een element:

padding-top: 1em;
padding-right: 1.5em;
padding-bottom: 0.5em;
padding-left: 2em;

Je kan ze alle vier met de steno-eigenschap instellen:

padding: 1em 1.5em 0.5em 2em;

Als de padding voor de bovenkant en de rechterkant gelijk is aan de padding voor de onderkant en de linkerkant:

padding: 1em 1.5em;

Als de padding voor alle kanten gelijk is kan je deze vereenvoudigde stijlregel gebruiken:

padding: 1em;

We verwijderen de margin instellingen uit het <p> element en stellen de padding in:

p {
    margin: 0;
    padding-top: 1em;
    padding-left: 3em;
}

Met dit als resultaat:

See the Pen CSS property - padding by Jef Inghelbrecht (@jef) on CodePen.